﻿@page "/bswup/service-worker"
@inherits AppComponentBase

<PageOutlet Url="bswup/service-worker"
            Title="Service Worker - Bswup"
            Description="service worker configuration of the bit Bswup" />

<div class="page-container">
    <BitText Typography="BitTypography.H3" Gutter>Service Worker</BitText>
    <br />
    <BitText Typography="BitTypography.Subtitle1" Gutter>
        bit Bswup has a lot of options available in the service worker file to configure its behavior.
    </BitText>
    <br />

    <section class="section-card">
        <BitText Typography="BitTypography.H5" Gutter>Bswup Service Worker</BitText>
        <div class="section-card-txt">
            A sample of all configuration available inside of the service worker file is shown here:

            <CodeBox>self.assetsInclude = [/\data.db$/];
self.assetsExclude = [/\.scp\.css$/, /weather\.json$/];
self.defaultUrl = '/';
self.prohibitedUrls = [/\/admin\//];
self.serverHandledUrls = [/\/api\//];
self.serverRenderedUrls = [/\/privacy$/];
self.externalAssets = [
    {
        "url": "/"
    },
    {
        "url": "https://www.googletagmanager.com/gtag/js?id=G-G123456789"
    }
];
self.assetsUrl = '/service-worker-assets.js';
self.noPrerenderQuery = 'no-prerender=true';
self.caseInsensitiveUrl = true;
self.ignoreDefaultInclude = true;
self.ignoreDefaultExclude = true;
self.isPassive = true;
self.disablePassiveFirstBoot = true;
self.enableIntegrityCheck = true;
self.enableDiagnostics = true;
self.enableFetchDiagnostics = true;

self.importScripts('_content/Bit.Bswup/bit-bswup.sw.js');</CodeBox>

            <div class="section-card">
                <b>Note</b>: The most important line here is the last line which is the only mandatory config in this file
                that imports the Bswup service-worker file:

                <CodeBox>self.importScripts('_content/Bit.Bswup/bit-bswup.sw.js');</CodeBox>
            </div>

            These available configurations are explained below:
            <br /><br />
            <b>assetsInclude</b>: The list of file names from the assets list to include when the Bswup
            tries to store them in the cache storage (regex supported).
            <br /><br />
            <b>assetsExclude</b>: The list of file names from the assets list to exclude when the Bswup
            tries to store them in the cache storage (regex supported).
            <br /><br />
            <b>externalAssets</b>: The list of external assets to cache that are not included in the auto-generated assets file.
            For example, if you're not using index.html (like _host.cshtml), then you should add { "url": "/" }.
            <br /><br />
            <b>defaultUrl</b>: The default page URL. Use / when using _Host.cshtml.
            <br /><br />
            <b>assetsUrl</b>: The file path of the service-worker assets file generated at compile time
            (the default file name is service-worker-assets.js).
            <br /><br />
            <b>prohibitedUrls</b>: The list of file names that should not be accessed (regex supported).
            <br /><br />
            <b>caseInsensitiveUrl</b>: Enables the case insensitivity in the URL checking of the cache process.
            <br /><br />
            <b>serverHandledUrls</b>: The list of URLs that do not enter the service-worker offline process and
            will be handled only by server (regex supported). such as /api, /swagger, ...
            <br /><br />
            <b>serverRenderedUrls</b>: The list of URLs that should be rendered by the server and not
            client while navigating (regex supported). such as /about.html, /privacy, ...
            <br /><br />
            <b>noPrerenderQuery</b>: The query string attached to the default document request to disable
            the prerendering from the server so an unwanted prerendered result not be cached.
            <br /><br />
            <b>ignoreDefaultInclude</b>: Ignores the default asset includes array which is provided by the
            Bswup itself which is like this:
            <CodeBox>[/\.dll$/, /\.pdb$/, /\.wasm/, /\.html/, /\.js$/, /\.json$/, /\.css$/, /\.woff$/, /\.png$/, /\.jpe?g$/, /\.gif$/, /\.ico$/, /\.blat$/, /\.dat$/, /\.svg$/, /\.woff2$/, /\.ttf$/, /\.webp$/]</CodeBox>

            <b>ignoreDefaultExclude</b>: Ignores the default asset excludes array which is provided by the Bswup
            itself which is like this:
            <CodeBox>[/^_content\/Bit\.Bswup\/bit-bswup\.sw\.js$/, /^service-worker\.js$/]"</CodeBox>

            <b>Note</b>: Keep in mind that caching service-worker related files will corrupt the update cycle of the service-worker.
            Only the browser should handle these files.
            <br /><br />
            <b>isPassive</b>: Enables the Bswup's passive mode. In this mode, the assets won't be
            cached in advance but rather upon initial request.
            <br /><br />
            <b>disablePassiveFirstBoot</b>: Disables downloading the Blazor's boot files in first time of Passive mode.
            <br /><br />
            <b>enableIntegrityCheck</b>: Enables the default integrity check available in browsers by setting
            the integrity attribute of the request object created in the service-worker to fetch the assets.
            <br /><br />
            <b>enableDiagnostics</b>: Enables diagnostics by pushing service-worker logs to the browser console.
            <br /><br />
            <b>enableFetchDiagnostics</b>: Enables fetch event diagnostics by pushing service-worker
            fetch event logs to the browser console.

        </div>
    </section>

</div>

<NavigationButtons Prev="Events" PrevUrl="/bswup/events" Next="BswupProgress" NextUrl="/bswup/progress" />
